<script setup lang="ts">
import { ContentWrap } from '@/components/ContentWrap'
import { ElButton } from 'element-plus'
import { Table } from '@/components/Table'
import { useTable } from '@/hooks/web/useTable'
import { ViewData } from '@/api/types/userType'
import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
import { ref, unref, reactive } from 'vue'
import api from '@/api'
const props=defineProps({
  data: {
    type: Object as PropType<Nullable<ViewData>>,
    default: () => null
  }
})
const { getDeviceMacList} = api
const { register, tableObject, methods } = useTable<ViewData>({
    getListApi:async(params)=>{
        const res = await getDeviceMacList({id:props.data?.id})
        return {data:{content:res.data,totalElements:res.data.length}}
    },
    response: {
        list: 'content',
        total: 'totalElements'
    }
})

const { getList } = methods
const crudSchemas = reactive<CrudSchema[]>([
    {
        field: 'index',
        label: '序号',
        type: 'index',
        form: {
            show: false
        },
        detail: {
            show: false
        }
    },
    {
        field: 'mac',
        label: '设备ID', search: { show: true },
        form: { colProps: { span: 24 } },
        detail: { span: 2, width: 100 }
    },
    {
        field: 'action',width: '160px',label: '操作',
        form: {show: false},
        detail: {show: false}
    }
])

const { allSchemas } = useCrudSchemas(crudSchemas)
getList()
const enableMac=(row)=>{
    
}
const disableMac=(row)=>{
    
}

</script>

<template>
    <ContentWrap>
        <Table
            v-model:pageSize="tableObject.pageSize"
            v-model:currentPage="tableObject.currentPage"
            :columns="allSchemas.tableColumns"
            :data="tableObject.tableList"
            :loading="tableObject.loading"            
            @register="register"
        >
            <template #action="{ row }">
                <ElButton type="primary" @click="enableMac(row)"> 启用 </ElButton>
                <ElButton type="danger" @click="disableMac(row)"> 停用 </ElButton>
            </template>
        </Table>
    </ContentWrap>
</template>
